<template>
	<view class="free-symmary">
		<view class="pic-wrap" @click="navTo()"><image class="pic" :src="item.media_img_url"></image></view>
		<view class="info-wrap">
			<text class="title">{{ item.course_title }}</text>
			<view class="promote">
				<text class="free-text">{{ item.is_free === 0 ? '收费' : '免费' }}</text>
				<!-- 应开发要求，隐藏查看次数，别的地方没有此功能，因此隐藏 -->
				<!-- <view class="watched">
					<text class="iconlessonfont icon-yanjing"></text>
					<text class="amount">{{ item.watch || 0 }}</text>
				</view> -->
			</view>
		</view>
	</view>
</template>

<script>
export default {
	props: {
		item: Object // 免费班每一条数据
	},
	methods: {
		navTo() {
			uni.navigateTo({
				url: 'lesson-detail?course_id=' + this.item.course_id
			});
		}
	}
};
</script>

<style scoped>
@import url('../../../static/font_lesson/iconfont.css');
.free-symmary {
	width: 336upx;
}

.pic-wrap {
	position: relative;
	height: 190upx;
	width: 100%;
	border-radius: 20upx;
	overflow: hidden;
}
.pic-wrap .pic {
	width: 100%;
	height: 100%;
	background: linear-gradient(90deg, rgba(236, 255, 240, 1) 0%, rgba(130, 255, 221, 1) 100%);
}

.info-wrap {
	margin-top: 8upx;
}
.info-wrap .title {
	font-size: 34upx;
	color: #333;
	font-weight: bold;
	line-height: 40upx;
	padding-left: 4upx;
}

.promote {
	display: flex;
	margin-top: 12upx;
	align-items: center;
}
.free-text {
	color: #ff9900;
	font-size: 26upx;
}
.watched {
	flex: 1;
	align-items: center;
	display: flex;
	justify-content: flex-end;
}
.watched .iconlessonfont {
	font-family: iconlessonfont;
	margin-right: 5px;
	color: #999;
	font-size: 38upx;
}
.watched .amount {
	color: #999;
	font-size: 26upx;
}
</style>
